<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body{
            background: darkblue;
        }
        img{
            position: absolute;
        }

    </style>
</head>
<body>
    <script>
        // setInterval(function(){},1000)  // 每隔一秒钟 执行一下函数
        setInterval(function(){

            var img = document.createElement('img')  // 创建一个img标签
            img.src = 'img/star.png'  // 给标签设置src属性 是star
            
            var l = Math.random() * 700  // 0-700的随机数
            var t = Math.random() * 500  // 0-500的随机数
            var w = Math.random() * 100 + 20  // 20-120的随机数

            img.style.top = t + 'px'
            img.style.left = l + 'px'
            img.style.width = w + 'px'

            img.onclick = function() {
                img.style.display = 'none'
            }


            document.body.appendChild(img)  // 将图片放置在body元素中


        },1000)  // 每隔一秒钟 执行一下函数
    </script>
</body>
</html>